<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <title>demo show</title>
    <!--<link href="/static/css/layout.css" rel="stylesheet" type="text/css">
    <link href="/static/css/default.css" rel="stylesheet" type="text/css">
    <link href="/static/css/iconfont.css" rel="stylesheet" type="text/css">
    <link href="/static/css/skin.css" rel="stylesheet" type="text/css">-->

    <link href="/static/css/index.css" rel="stylesheet" type="text/css">
    <link href="/static/css/controls.css" rel="stylesheet" type="text/css">

    <style type="text/css">
        .select-down-a-key {
            color: #2aa1d3;
            background: #f3f8ff;
        }
    </style>

    <!--[if lt IE 9]>
    <script src="/bower_components/respond/dest/respond.min.js"></script>
    <![endif]-->
    <script>
        var ctx = '';
        var basePath = '/gillion-web';
        var locale = 'zh-cn'
    </script>
    <script src="/bower_components/requirejs/require.js" data-main="/static/app.js" data-bootstrap-modules="'../../html/demo/dropdown/testDropdownModule'"></script>

</head>
<body>
<div class="wrapper skin">

    <div class="section">
        <div class="section_header">
            下拉框
        </div>
        <div class="section_body">

            list-type : 下拉框类型 single单选框,multi复选框 默认为简单下拉框<br/>
            source : 数据源 跟ng-controller中的指定值双向绑定<br/>
            placeholder : 默认显示内容<br/>
            add-event : 添加事件 绑定ng-controller事件 默认无<br/>
            display-express : 显示字段名<br/>
            value-prop : 提交字段名<br/>
            disabled : 是否启用true，false  默认true<br/>
            超过八条显示滚动条<br/>
            子指令g-dropitem可添加默认选项<br/>
        </div>
        <div class="section_body" ng-controller="DropdownController">
            <ul class="control_List">
                <li style="width: 300px">
                    回显更改控制框 <input type="text" ng-model="test1" />
                    <g-dropdown width="250px" css-class="ddd" list-type="single" placeholder="请选择" source="roles"  ng-model="test1"  display-express="roleName" value-prop="roleId" >
                        <g-dropitem value="">指令添加</g-dropitem>
                    </g-dropdown>
                </li>
                <li style="width: 300px">
                    回显更改控制框 <input type="text" ng-model="test2" />
                    <g-dropdown list-type="multi" source="roles2"   ng-model="test2" display-express="roleName" value-prop="roleId">

                    </g-dropdown>
                </li>
                <li style="width: 300px">
                    <g-dropdown source="roles3" submit-name="roleIds" ng-model="test3" display-express="roleName" value-prop="roleId"></g-dropdown>
                </li>
                <li style="width: 300px">
                    <g-dropdown add-event="addEle()" source="roles4"  ng-model="test4" display-express="roleName" value-prop="roleId"></g-dropdown>
                </li>
                <li style="width: 300px">
                    <g-dropdown  placeholder="请选择" source="roles5" ng-model="test5" display-express="roleName" value-prop="roleId">
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                        <g-dropitem value="5">滚呀嘛滚动条</g-dropitem>
                    </g-dropdown>
                </li>

            </ul>
        </div>
    </div>

</div>
</body>
</html>